<template>
    <div class="goodsdetail">
        <van-nav-bar title="" left-text="" left-arrow @click-left="onClickLeft" />
        <section>
            <div class="picbox">
                <van-image width="3.75rem" height="3.46rem" fit="cover" :src="images.path" />
            </div>
            <div class="price">{{ goodsdesc.price }}</div>
            <h2 class="title">{{ goodsdesc.name }}</h2>
            <p>{{ goodsdesc.desc }}</p>
            <div class="contentbox" ref="richtext">
                <!-- <h2>商品详情</h2> -->

            </div>
        </section>
        <van-action-bar>
            <van-action-bar-icon icon="chat-o" text="客服" color="#ee0a24" />
            <van-action-bar-icon icon="cart-o" text="购物车" @click="gocart()" />
            <van-action-bar-icon icon="star" text="已收藏" color="#ff5000" />
            <van-action-bar-button type="warning" text="加入购物车" @click="addlist()" />
            <van-action-bar-button type="danger" text="立即购买" />
        </van-action-bar>


    </div>
</template>

<script setup>
import router from '@/router';
import { useRoute } from "vue-router"
import { get, posttoken } from "../utils/request.js"
import { ref } from "vue"
import { useStore } from "vuex"
let store = useStore()
let goodsdesc = ref({})
let richtext = ref(null)
let images = ref([])
const route = useRoute()
const goodsitem = ref(
    {
        name: goodsdesc.value.price,
        price: "234",
        counts: "00",
    }
)


//返回
const onClickLeft = () => {
    router.push("/")
}
//详情页
(async function getgoods () {
    let res = await get(`/goods/${route.params.id}`)
    goodsdesc.value = res.result
    // console.log(goodsdesc.value.id);
    images.value = goodsdesc.value.s_goods_photos[0]
    // console.log(images.value.path);
    richtext.value.innerHTML = goodsdesc.value.rich_text
})()
//去购物车
const gocart = () => {
    router.push("/cart")
}
//

  

const addlist = () => {

    posttoken("/shoppingCart/",{
        goods_id:goodsdesc.value.id,
        num:1,
        project_id:238
    })




    // store.commit("user/addcart", data)

}
</script>

<style lang="scss" scoped>
* {
    margin: 0;
    padding: 0;
}

.goodsdetail {
    width: 3.75rem;
    height: 6.67rem;

    .picbox {
        width: 3.75rem;
        height: 3.46rem;
        // background-color: yellowgreen;
        overflow: hidden;

    }

    .contentbox {
        h2 {
            background-color: yellow;
        }

        width: 3.75rem;
        height: auto;
        // background-color: yellowgreen;
    }

}
</style>